<!-- @format -->

<template>
  <div class="app" v-cloak>
    <router-view />
    <comp-loading :visible="theShowLoading" type="full" />
  </div>
</template>

<script setup lang="ts">
  import { ref, watch } from 'vue';
  import { useGlobalLoading } from '@/hooks/useLoading';
  import CompLoading from '@/components/comp-loading/Index.vue';
  const theGlobalLoading = useGlobalLoading();
  const theShowLoading = ref(true);
  watch(
    () => theGlobalLoading.loading,
    (newValue) => {
      theShowLoading.value = newValue;
    },
    { deep: true, immediate: true },
  );
</script>
<style>
  .app {
    /* font-family: 'sy-medium'; */
  }
</style>
